<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta name="Generator" content="ALORK 20150428.01" />
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="Keywords" content="<?php echo $this->_var['keywords']; ?>" />
<meta name="Description" content="<?php echo $this->_var['description']; ?>" />

<title><?php echo $this->_var['page_title']; ?></title>

<?php if ($this->_var['cat_style']): ?>
<link href="<?php echo $this->_var['cat_style']; ?>" rel="stylesheet" type="text/css" />
<?php endif; ?>
<link rel="stylesheet" href="<?php echo $this->_var['ecs_css_my']; ?>" />
<link rel="stylesheet" href="<?php echo $this->_var['ecs_css_path']; ?>" />
<link rel="stylesheet" href="<?php echo $this->_var['__PUC__']; ?>css/common.css" />
  <?php echo $this->smarty_insert_scripts(array('files'=>'common.js')); ?>
</head>
<body >
  <?php echo $this->fetch('library/page_header.lbi'); ?>
  <div class="goods_top"></div>
  <div style="width: 100%;float: left;">
  <div id="goods" class="body">
  <div class="body">
    <div id="magnifier_pic"><div class="magnifier_pic"><img src="<?php echo $this->_var['info']['img']; ?>"/></div></div>
    <div class="box_top">
    <div class="photo">
      <div class="big_img" >
        <div class="magnifier"></div>
          <img src="<?php echo $this->_var['info']['goods_list']['0']['goods_img']; ?>" alt="<?php echo htmlspecialchars($this->_var['goods']['goods_name']); ?>"/>
      </div>
      <div class="thumb">
          <?php $_from = $this->_var['info']['goods_list']; if (!is_array($_from) && !is_object($_from)) { settype($_from, 'array'); }; $this->push_vars('key', 'goods');if (count($_from)):
    foreach ($_from AS $this->_var['key'] => $this->_var['goods']):
?>
            <a href="javascript:void();" target="_blank">
          <?php if ($this->_var['key'] == 0): ?>
            <span class="thumb_top thumb_top_b"></span>
            <?php else: ?>
            <span class="thumb_top"></span>
          <?php endif; ?>
            <img src="<?php if ($this->_var['goods']['goods_thumb']): ?><?php echo $this->_var['goods']['goods_thumb']; ?><?php else: ?><?php echo $this->_var['goods']['goods_img']; ?><?php endif; ?>" big="<?php echo $this->_var['goods']['goods_img']; ?>" original="<?php echo $this->_var['goods']['original_img']; ?>" alt="<?php echo $this->_var['goods']['goods_name']; ?>" title="<?php echo $this->_var['goods']['goods_name']; ?>" class="B_blue" /></a>
          <?php endforeach; endif; unset($_from); ?><?php $this->pop_vars();; ?>
      </div>
    </div>
    <div class="info">
      <div class="clearfix title"><?php echo $this->_var['info']['name']; ?></div>
      <div class="activity">
        <div class="left">
          <span class="shop_price">劲惠价 ：<?php echo $this->_var['info']['price']; ?></span>
          <span class="market_price">单卖价 ：<span><?php echo $this->_var['info']['original_price']; ?></span></span>
        </div>
        <div class="discount"><?php echo $this->_var['info']['discount']; ?> 折</div>
        <div class="buy_some">已被抢购<?php echo $this->_var['info']['beiqiang']; ?>件</div>
      </div>
      <div class="clearfix"></div>
      <div class="clearfix"><span class="left">评分：</span><span class="rank"><span class="rank_this" style="width:100%"></span></span></div>
      <div class="clearfix"><span class="left">配送至：</span>
        <?php echo $this->fetch('library/ship_area.lbi'); ?>
      </div>
      <form action="" method="post" name="ECS_FORMBUY" id="ECS_FORMBUY" >
      <?php if ($this->_var['info']['stock_list']['valid_number'] > 0): ?>
      <div class="clearfix" id="num"><span class="left">数量</span>
        <span class="button">
          <span class="pre">-</span>
          <span class="color_num">
            <input id="alork_num" name="number" type="text" value="1" size="4" onblur="changePrice()" class="color_input isnumber"/></span>
          <span class="next">+</span>
        </span>
      </div>
      <li class="padd" style="position:relative;" >
        <a <?php if (! $_SESSION['user_id']): ?>onclick="ajax_popup('login');"<?php else: ?> href="javascript:activityToCart(<?php echo $this->_var['info']['parent_id']; ?>)"  <?php endif; ?>   id="goods_submit" class="button_2">立即抢购</a>
        <div id="gwc"></div>
      </li>
      <?php else: ?>
      <div class="clearfix"></div>
      <li class="padd" style="position:relative;" >
        <a id="goods_submit" class="button_2 notbuy">已售罄</a>
        <div id="gwc" style="color: #8b0409;width: 100%;float: left;">
          抱歉！此商品已售罄！</div>
      </li>
      <?php endif; ?>
      <div class="Share">
        喜欢这件画材吗？ <a href="<?php echo $this->_var['info']['share_url']; ?>" style="color: #8b0409" target="_blank">分享</a>给你的朋友吧<span style="color: #8b0409">！！</span>分享到微博<a href="<?php echo $this->_var['info']['share_url']; ?>" class="share_ico" target="_blank"></a>
      </div>
      </form>
    </div>
    </div>
    <div class="more">
      <?php echo $this->fetch('library/history.lbi'); ?>
    </div>
    <div class="main">
      <div class="nav">
        <ul>
          <li class="hover">商品信息</li>
        </ul>
      </div>

      <div class="box1 box">
        <?php echo $this->_var['info']['content']; ?>
      </div>
    </div>

  </div>
 </div>
</div>
<?php echo $this->fetch('common/page_footer.lbi'); ?>
<?php echo $this->fetch('common/follow_right.lbi'); ?>
<script type="text/javascript">

  // 加入购物车
  function activityToCart(id){
    var number = $("#alork_num").val();
    var ext = 'libao';
    addToCart(id,'', number, ext);
    return false;
  }


</script>

<script type="text/javascript">
  $(function(){

    // 规格数量选择器
    $("#num .button .pre").click(function(){
      var num=$("#alork_num").val();
      if (parseInt(num)>1) {
        num=parseInt(num)-1;
        $("#alork_num").val(num);
      };
    });
    $("#num .button .next").click(function(){

      var num=$("#alork_num").val();
      num=parseInt(num)+1;
      if(num><?php echo empty($this->_var['info']['stock_list']['valid_number']) ? 0 : $this->_var['info']['stock_list']['valid_number']; ?>)
      { 
        num = <?php echo empty($this->_var['info']['stock_list']['valid_number']) ? 0 : $this->_var['info']['stock_list']['valid_number']; ?>;
        $('#gwc').text('此商品最后只剩<?php echo empty($this->_var['info']['stock_list']['valid_number']) ? 0 : $this->_var['info']['stock_list']['valid_number']; ?>件啦！速度抢哦');
      }
      $("#alork_num").val(num);
    });

    // 选择数量
    $("#num .button .color_num input").blur(function(){
      num=parseInt($("#alork_num").val());//获取用户输入数量
      if(num > <?php echo empty($this->_var['info']['stock_list']['valid_number']) ? 0 : $this->_var['info']['stock_list']['valid_number']; ?>)
      {
        num = <?php echo empty($this->_var['info']['stock_list']['valid_number']) ? 0 : $this->_var['info']['stock_list']['valid_number']; ?>;
        $('#gwc').text('此特惠礼包最后只剩<?php echo empty($this->_var['info']['stock_list']['valid_number']) ? 0 : $this->_var['info']['stock_list']['valid_number']; ?>件啦！速度抢哦').css('color','#8b0409');
      }
      $("#alork_num").val(num);
    });


  });
// 商品图片变换
    $(function(){
      $("#goods .photo .thumb img").mouseenter(function(){
        $(this).parent().find(".thumb_top").addClass("thumb_top_b").parent().siblings().find(".thumb_top").removeClass('thumb_top_b');
        $("#goods .photo .big_img img").attr("src",$(this).attr("big"));
        $("#goods .body .none img").attr("src",$(this).attr("original"));
        $('#magnifier_pic .magnifier_pic img').attr("src",$(this).attr("original"));
        // $("#goods .body .magnifier_pic img").attr("src",$(this).attr("original"));
      });     
    });
    // 放大镜JS
    $(document).ready(function(){
      $(".mores").toggle(
        function(){
            $(".color_border").css("height","auto");
            $(this).addClass("mores1");
        },
            function(){
            $(".color_border").css("height","125px");
            $(this).removeClass("mores1");
        }
      );

      var img=444;//定义区域大小
    var xOffset = 111;//定义x的偏移量
      var yOffset = 111;//定义y的偏移量
    $("#goods .photo .big_img img").mouseenter(function(){
      var ran = 'pic'+Math.floor(Math.random()*10000+1);
      $("#goods .body").prepend('<div class="'+ran+'">'+$('#magnifier_pic').html()+'</div>');
      $("#goods .photo .big_img .magnifier").show();
      $("#goods .body ."+ran+" .magnifier_pic").animate({
        height:'400px',
        width:'400px',
        marginTop:"27px",
        marginRight:"100px",
        opacity:'1'
        });
      $("#goods .photo .big_img").mouseleave(function(){
        $("#goods .photo .big_img .magnifier").hide();
        $("#goods .body ."+ran+" .magnifier_pic").animate({
          height:'0px',
          width:'0px',
          opacity:'0',
          marginTop:"200px",
          marginRight:"800px"
          },300);
          setTimeout(function(){removes(ran)},600);
        // $("#goods .body .magnifier_pic").hide();
      });
    });
    function removes(ran){
      $("#goods .body ."+ran).remove();
    }




  $("#goods .photo .big_img").mousemove(function(e){
    $("#goods .photo .big_img").css({"position":"relative"});
    $("#goods .body").css({"position":"relative"});
      var positionX=e.pageX-$(this).offset().left||e.originalEvent.layerX-$(this).offset().left||0;//获取当前鼠标相对img的x坐标
      var positionY=e.pageY-$(this).offset().top||e.originalEvent.layerY-$(this).offset().top||0;
      if(yOffset>positionY<(img-yOffset)){
        $("#goods .photo .big_img .magnifier").css("top",(positionY-yOffset));
      }
      if(positionY<yOffset){
        $("#goods .photo .big_img .magnifier").css("top",0);
      }
      if(positionY>(img-yOffset)){
        $("#goods .photo .big_img .magnifier").css("top",(img-yOffset*2));
      }

      if(xOffset>positionX<(img-xOffset)){
        $("#goods .photo .big_img .magnifier").css("left",(positionX-xOffset));
      }
      if(positionX<xOffset){
        $("#goods .photo .big_img .magnifier").css("left",0);
      }
      if(positionX>(img-xOffset)){
        $("#goods .photo .big_img .magnifier").css("left",(img-xOffset*2));
      }
      var left=parseInt($("#goods .photo .big_img .magnifier").css('left'));
      var top=parseInt($("#goods .photo .big_img .magnifier").css('top'));
// $("#goods .photo .big_img .magnifier").text("X: " + left + ", Y: " + top);
      
         $("#goods .body .magnifier_pic img").css("top",(-top*1.8)).css("left",(-left*1.8));
         if(top>268){
            $("#goods .body .magnifier_pic img").css("top",(-268*1.8)).css("left",(-left*1.8));
         }
    });
  });

</script>
</body>



</html>